<template>
	<view>

		<view class="accountDetail_box">
			<view class="accountDetail_con">
				<view class="dot dotLeft"></view>
				<view class="dot dotRight"></view>
				<view class="accountHead_box">
					<view class="accountDate">{{accountInfo.add_date}}</view>
				</view>
				<view class="accountBody_box">
					<view class="accountName">{{userInfo.name}}</view>
					<view class="accountProject">工地：{{projectInfo.name}}</view>
					
					
					<!-- <view class="accountApply">申请日期：{{accountDetail.add_time_str}}</view> -->
					<view class="accountTable" v-for="(item,index) in logList" :key="index">
						<view class="accountTop">
							修改时间{{item.add_time_str}}
							<text v-if="item.edit_name">修改人:{{item.edit_name}}</text>
						</view>
						<u-table border-color="#fff" :th-style="thStyle">
							<u-tr class="u-tr">
								<u-th class="u-th"> </u-th>
								<u-th class="u-th">修改前</u-th>
								<u-th class="u-th">修改后</u-th>
							</u-tr>
							<u-tr class="u-tr">
								<u-td class="u-td">
									<text v-if="accountInfo.account_type==1">人工</text>
									<text v-if="accountInfo.account_type==2">材料</text>
									<text v-if="accountInfo.account_type==3">杂费</text>
								</u-td>
								<u-td class="u-td">
									{{item.cost}}元
									
								</u-td>
								<u-td class="u-td">
									{{item.cost_new}}元
								</u-td>
							</u-tr>
							<!-- <u-tr class="u-tr">
								<u-td class="u-td">总工资</u-td>
								<u-td class="u-td">{{item.price}}</u-td>
								<u-td class="u-td">{{item.price_hour}}</u-td>
							</u-tr> -->
						</u-table>
					</view>
					
				</view>
			</view>
		</view>

	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 表格style
				thStyle: {
					'backgroundColor': '#fff',
				},

				// 账目详情
				id: '',
				logList: {},
				projectInfo: {},
				userInfo: {},
				accountInfo:{},
				// 拒绝弹窗
				customShow: false,
			}
		},
		onLoad(option) {
			// uni.showLoading({
			// 	title: '加载中'
			// });
			if (option.id) {
				this.id = option.id;
			}
			
		},
		onShow() {

		},
		onReady() {
			var _this = this;
			_this.getAccountDetail();
		},
		methods: {
			// 获取日志详情
			getAccountDetail() {
				var _this = this;
				_this.$u.get('/api/project.salary/accountLogList', {
					id: _this.id,
				}).then(res => {
					uni.hideLoading();
					_this.logList = res.data;
					_this.projectInfo = res.extend.projectInfo;
					_this.userInfo = res.extend.userInfo;
					_this.accountInfo = res.extend.accountInfo;
				}).catch(res => {
					console.log(res);
				})
			},

			// 获取拒绝理由
			nameInput(e) {
				// console.log(e.detail.value);
				this.customName = e.detail.value;
			},

			// 提交拒绝
			refuseClick() {
				var _this = this;
				_this.$u.post('/api/project.salary/workLogStatus', {
					id: _this.id,
					status: '2', //1同意、2拒绝
					name: _this.customName,
				}).then(res => {
					_this.closePop();
					_this.getAccountDetail();
				}).catch(res => {
					console.log(res);
				})
			},
			
			// 同意
			agreeClick(){
				var _this = this;
				uni.showModal({
					title: '提示',
					content: '是否确认同意？',
					success: function (res) {
						if (res.confirm) {
							// console.log('用户点击确定');
							_this.$u.post('/api/project.salary/workLogStatus', {
								id: _this.id,
								status: '1', //1同意、2拒绝
							}).then(res => {
								_this.getAccountDetail();
							}).catch(res => {
								console.log(res);
							})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			
			// 关闭弹窗
			closePop(){
				this.customShow = false;
				this.customName = '';
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.accountDetail_box {
		padding: 30rpx;
	}

	.accountDetail_con {
		width: 100%;
		overflow: hidden;
		position: relative;
	}

	.dot {
		width: 20rpx;
		height: 20rpx;
		background-color: #F5F5F5;
		border-radius: 50%;
		overflow: hidden;
	}

	.dotLeft {
		position: absolute;
		left: -10rpx;
		top: 90rpx;
		z-index: 10;
	}

	.dotRight {
		position: absolute;
		right: -10rpx;
		top: 90rpx;
		z-index: 10;
	}

	.accountHead_box {
		width: 100%;
		height: 100rpx;
		background: #eee;
		overflow: hidden;
	}

	.accountDate {
		line-height: 100rpx;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
	}

	.accountBody_box {
		width: 100%;
		min-height: 400rpx;
		padding: 30rpx;
		background: #fff;
		position: relative;
		overflow: hidden;
	}

	.accountRes {
		width: 120rpx;
		height: 120rpx;
		position: absolute;
		right: 30rpx;
		top: 30rpx;
	}

	.accountName {
		padding: 30rpx 0;
		font-size: 40rpx;
		font-weight: bold;
		text-align: center;
		overflow: hidden;
	}

	.accountProject {
		font-size: 28rpx;
		color: $uni-color-text;
		text-align: center;
		margin-bottom: 60rpx;
	}

	.accountApply {
		height: 90rpx;
		line-height: 90rpx;
		font-size: 28rpx;
		border-top: 1rpx solid #eee;
		border-bottom: 1rpx solid #eee;
		box-sizing: border-box;
		overflow: hidden;
	}

	.accountRefuse {
		padding: 30rpx 0;
	}

	.accountAgree {
		padding: 30rpx 0;
		text-align: center;
		color: $uni-color-active;
	}

	// 拒绝弹窗
	.materialCustom_box {
		background-color: #fff;
	}

	.customTit {
		font-size: 36rpx;
		font-weight: bold;
		color: $uni-color;
		text-align: center;
		overflow: hidden;
		margin: 40rpx 0;
	}

	.customInput {
		background: #f0f0f0;
		border-radius: 10rpx;
		overflow: hidden;
		margin: 0 30rpx 40rpx;
	}

	.customInput textarea {
		width: 100%;
		height: 200rpx;
		padding: 20rpx;
		box-sizing: border-box;
		overflow: hidden;
	}
	
	.accountTable{
		border:2rpx solid #eee;
		margin-bottom: 20rpx;
		padding-bottom: 10rpx;
		border-radius: 10rpx;
	}
	
	
	.accountTop{
		border-bottom: 2rpx solid #eee;
		padding: 20rpx;
		background-color: #f7feff;
	}
	.accountTop text{
		float: right;
	}
</style>
